<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <!-- 11. -->
    <div id="content">
        <div id="inner"></div>
    </div>
    <script>
        // 11.如图，父元素#content大小未知，子元素#inner宽高都为50px，设置#inner的样式，使其在#content的正中央显示
        // 12.编写js方法找出数组arr中重复出现过的元素，例子：foo([1,2,4,4,3,3,1,5,3]).sort()
        // 输出例子:[1,3,4]
        //  先对数组进行排序，判断前一个与后一个相等且没有保存的情况下，再把元素放到数组中去。
        function foo(arr){
            var add=[]
            arr.sort()
            for(var i=0;i<arr.length;i++){
                if(arr[i]==arr[i+1]&&(add.indexOf(arr[i])==-1)){
                    add.push(arr[i])
                    i++;
                }
            }
            return add
        }
        // console.log(foo([1,2,4,4,3,3,1,5,3]).sort());//[1, 3, 4]
        // 13.编写js方法，提取url中的参数，并以key-value的形式返回到一个json结构中
        // 比如: fn("https://item.taobao.com/item.html?a=1&b=2&c=&d=xxx&e")
        // 返回 :{a: "1", b : "2", c : "", d : "xxx", e : undefined}
        function fn(a){
            var index=a.indexOf("?")
            // 把？后面的字符截取出来
            var b=a.slice(index+1)
            // 以&分割转换成数组
            var c=b.split("&")
            var list={}
            for(var i=0;i<c.length;i++){
                // 以=为分割=>['a','1']
                var d=c[i].split("=")
                // 键值对形式保存 {a:1}
                list[d[0]]=d[1]
            }
            return list
        }
        console.log(fn("https://item.taobao.com/item.html?a=1&b=2&c=&d=xxx&e"));

        // 14.输出结果是什么？应该怎么样输出0，1，2，3
        // for (var i = 0; i <= 3; i++) {
        //     setTimeout(function () {
        //         console.log(i);//4
        //     }, 0)
        // }
        // es6变量声明  把var改成let就可以得出
        for (let i = 0; i <= 3; i++) {
            setTimeout(function () {
                console.log(i);//0，1，2，3
            }, 0)
        }
        // // 闭包形式
        for (var i = 0; i <= 3; i++) {
            setTimeout(((i) => {
                return () => {
                    console.log(i);
                }
            })(i),(i*1000))
        }
    </script>
</body>
<style>
    #content {
        width: 240px;
        height: 200px;
        border: 1px solid #000;
        margin: 50px auto;
    }

    #inner {
        width: 50px;
        height: 50px;
        border: 1px solid #000;
        margin: 70px auto;
    }
</style>

</html>